import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { ApiService } from './../../../core/api/api.service';
import { MessageService } from './../../../core/service/message.service';
import { NzMessageService, NzModalService } from 'ng-zorro-antd';
@Component({
    selector: 'app-menu-mgmt',
    templateUrl: './menu-mgmt.component.html',
})
export class MenuMgmtComponent implements OnInit {
    menuList = []; // 菜单列表数据
    isVisible = false; // 是否显示弹出框
    modalTitle; // 弹出框标题
    isOkLoading = false; // 弹出框按钮加载动画
    tableLoading = false;
    validateForm;
    activeData: any = {};
    ngOnInit() {
        this.message.setBreadcrumb({
            breadcrumbs: [
            {name: '菜单管理'}
        ]});
        this.validateForm = this.fb.group({
            name: [null, [ Validators.required]],
            frontPath: [null],
            path: [null],
            image: [null],
        });
        this.getMenuList();
    }
    changeExpand(e, item) {
        if (!e) {
            item.children.forEach(element => {
                element.expand = e;
            });
        }
    }
    getTree(list) {
        const array = [], obj = {};
        list.forEach(element => {
            if (element.parentId === 0) {
                array.push(element);
            }
            obj[element.id] = element;
        });
        list.forEach(element => {
            if (obj[element.parentId]) {
                obj[element.parentId].children ? obj[element.parentId].children.push(element) : obj[element.parentId].children = [element];
            }
        });
        return array;
    };
    handleOk() {
        this.isOkLoading = true;

        this.apiService.post(this.activeData.id ? '编辑菜单' : '创建菜单', {...this.validateForm.getRawValue(), ...this.activeData}).then((res: any) => {
            this.isOkLoading = false;
            this.isVisible = false;
            this.nzMessageService.success(this.activeData.id ? '修改成功！' : '新增成功！');
            this.getMenuList();
        }).catch(res => {
            this.isOkLoading = false;
        });
    }
    handleCancel() {
        this.isVisible = false;
    }
    addMenu(){
        this.isVisible = true;
        this.modalTitle = '新增菜单';
        this.activeData = {position: 0, parentId: 0};
    }
    addChildMenu(item) {
        this.isVisible = true;
        this.modalTitle = '新增子菜单';
        this.activeData = {position: 1, parentId: item.id};
    }
    addChildBtn(item) {
        this.isVisible = true;
        this.modalTitle = '新增按钮权限';
        this.activeData = {position: 2, parentId: item.id};
    }
    updateMenu(item) {
        this.isVisible = true;
        this.modalTitle = '编辑菜单';
        this.activeData = {id:item.id,parentId:item.parentId,position:item.position};
        this.validateForm.setValue({name:item.name,frontPath:item.frontPath,path:item.path,image:item.image});
    }
    deleteMenu(item) {
        this.modal.confirm({
            nzTitle: '是否确定删除此菜单?',
            nzContent: '删除菜单会同时删除所有子菜单！',
            nzOnOk: () =>
                new Promise((resolve, reject) => {
                    this.apiService.post('删除菜单', {id: item.id}).then((res: any) => {
                        resolve();
                        this.nzMessageService.success('删除成功！');
                        this.getMenuList();
                    }).catch(res => {
                        this.isOkLoading = false;
                        reject();
                        this.nzMessageService.success('删除失败！');
                    });
                }).catch(() => console.log('Oops errors!'))
        });
    }
    getMenuList() {
        this.tableLoading = true;
        this.apiService.post('菜单列表', {}).then((res: any) => {
            this.menuList = this.getTree(res.data.list);
            this.tableLoading = false;
        }).catch(res => {
            this.tableLoading = false;
        });
    }
    constructor(
        private router: Router,
        private fb: FormBuilder,
        private apiService: ApiService,
        private message: MessageService,
        private nzMessageService:NzMessageService,
        private modal: NzModalService
    ) { }
}
